<?php
	session_start();
	$_SESSION['username'] = "user_".rand(0,1000);
?>
﻿<!DOCTYPE html>
<html lang="en">
<head>
	<title>Trái cây sạch OhStars</title>
	
	<link href="css/style.css" rel="stylesheet" type="text/css" />
	<link href="css/bootstrap.min.css" rel="stylesheet">
	<link href="css/smoothness/jquery-ui-1.8.24.custom.css" rel="stylesheet">
	
	<script src="js/jquery-ui-1.8.24.custom.min.js"></script>
	<script src="js/jquery-1.8.2.min.js"></script>
	<script src="js/bootstrap.min.js"></script>
	<script src="js/main_bk.js"></script>
	<script src="js/jquery.showLoading.min.js"></script>
	<script type="text/javascript" src="js/chat.js"></script>
	
	<link rel="icon" href="img/favicon.ico">
	<link type="text/css" rel="stylesheet" media="all" href="css/chat.css" />

	<!--[if lte IE 7]>
	<link type="text/css" rel="stylesheet" media="all" href="css/screen_ie.css" />
	<![endif]-->

</head>

<body>
	
	<!-- background  div-->
	<div id="bg_div">
	</div>
	
	<!-- toolbar -->
	<div id="tb_nav">
		<table width="99%">
		<tr>
			<td width="13%"></td>
			<td >
				<ul class="nav nav-tabs" style="margin-top:2px">
					<li class="active">
						<a href="index.php">Trang chủ</a>
					</li>
					<li><a href="introduce.php">Giới thiệu</a></li>
					<li><a href="products.php">Sản phẩm</a></li>
					<li><a href="health.php">Sức khỏe</a></li>
					<li><a href="contact.php" role="button" >Liên hệ</a></li>
				</ul>
				
			</td>
			<td align="right" width="200px">
				<div style="margin-top:20px">
					<form class="form-search">
						<div class="input-append">
						<input type="text" class="span2 search-query">
						<button type="submit" class="btn">Search</button>
						</div>
					</form>
				</div>
			</td>
			<td width="13%"></td>
		</tr>
		</table>
	</div>
	
	<!-- body div -->
	<div id="main_body">
		<table width="99%" border="0" cellpadding="0" cellspacing="0">
		  <tr>
			<td valign="top" align="right"></td>
			<td height="80">
				
				<!------------- header ----------------->
				<div id="header">
					<table width="99%" height="99%">
						<tr>
							<td width="31%" valign="top" align="left"><img src="img/top_left.png" height="200" width="200"></td>
							<td align='right'>
								<div id="logo">
							</td>
							<td align="center">
								<div id="title">
							</td>
							<td width="31%" valign="bottom" align="right"><img src="img/bottom_right.png" height="200" width="200"></td>
						</tr>
					</table>
				</div>
				<!------------ end of header -------------->
				
			</td>
			<td ></td>
		  </tr>
		  <tr height="0"></tr>
		  <tr>
			<td ></td>
			<td >
			
				<!---------- body ------------->
				<div style="margin-bottom:6px;">
						<marquee><i> Trái cây sạch OhStars. Vì sức khỏe của bạn!</i></marquee>
				</div>	
				<div id='main_content'>
					<table width="100%">
						<tr>
							<td class="content_header" width="20%">
							Trái cây & Sức khỏe
								<hr style="margin:0px;"/>
							</td>
						</tr>
						<tr>
							<td class="content_body" id="main_content_body">
								<table width="100%" border="0">
									<tr valign="top">
										<td width="5%" rowspan="2">
											<a href="#" onClick="show_detailt();return false;"><img src="img/mangcuc.jpg" class="img-polaroid"></a>
										</td>
										<td width="20px"></td>
										<td>
											<a href="#" onClick="show_detailt();return false;"><b>Tên gọi: Lôm chôm</b></a><br/>
											Xuát sứ Trung Quốc. Có tính chất ngọt, thơm, màu sắc đẹp, thơm ngon, bỗ dưỡng<br/>
											Trái được sử dụng để chế bến nhiều món ăn ngon như chè, trái cây và các loại thức uống khác.<br/>
											Công dụng: bổ sung nhiều Vitamin D, cung cấp cho con người nhiều chất dinh duõng
											
										</td>
									</tr>
									<tr valign="bottom">
										<td width="20px"></td>
										<td align="right">
											<a href="#" onClick="show_detailt();return false;">...Chi tiết</a>
										</td>
									</tr>
									<tr>
										<td colspan="2">
										</td>
										<td>
											<hr style="margin-top:0px"/>
										</td>
									</tr>
									
									<tr valign="top">
										<td width="5%" rowspan="2">
											<a href="#" onClick="show_detailt();return false;"><img src="img/mangcuc.jpg" class="img-polaroid"></a>
										</td>
										<td width="20px"></td>
										<td>
											<a href="#" onClick="show_detailt();return false;"><b>Tên gọi: Lôm chôm</b></a><br/>
											Xuát sứ Trung Quốc. Có tính chất ngọt, thơm, màu sắc đẹp, thơm ngon, bỗ dưỡng<br/>
											Trái được sử dụng để chế bến nhiều món ăn ngon như chè, trái cây và các loại thức uống khác.<br/>
											Công dụng: bổ sung nhiều Vitamin D, cung cấp cho con người nhiều chất dinh duõng
											
										</td>
									</tr>
									<tr valign="bottom">
										<td width="20px"></td>
										<td align="right">
											<a href="#" onClick="show_detailt();return false;">...Chi tiết</a>
										</td>
									</tr>
									<tr>
										<td colspan="2">
										</td>
										<td>
											<hr style="margin-top:0px"/>
										</td>
									</tr>
									
									<tr valign="top">
										<td width="5%" rowspan="2">
											<a href="#" onClick="show_detailt();return false;"><img src="img/mangcuc.jpg" class="img-polaroid"></a>
										</td>
										<td width="20px"></td>
										<td>
											<a href="#" onClick="show_detailt();return false;"><b>Tên gọi: Lôm chôm</b></a><br/>
											Xuát sứ Trung Quốc. Có tính chất ngọt, thơm, màu sắc đẹp, thơm ngon, bỗ dưỡng<br/>
											Trái được sử dụng để chế bến nhiều món ăn ngon như chè, trái cây và các loại thức uống khác.<br/>
											Công dụng: bổ sung nhiều Vitamin D, cung cấp cho con người nhiều chất dinh duõng
											
										</td>
									</tr>
									<tr valign="bottom">
										<td width="20px"></td>
										<td align="right">
											<a href="#" onClick="show_detailt();return false;">...Chi tiết</a>
										</td>
									</tr>
									<tr valign="bottom">
										<td height="20px" colspan="3"></td>
									</tr>
    								<tr>
										<td align="left" colspan="3">
											<a href="#">Các loại khác...</a>
										</td>
									</tr>
								</table>
							</td>
						</tr>
					</table>
				</div>
				<!-------- end of body ------->
				
			</td>
			<td ></td>
		  </tr>
		  <tr>
			<td width="13%"></td>
			<td align='right'>
			
				<!------------- footer ----------->
				<div id="footer">
					<hr/>
					<table width='100%'>
					<tr  style="color:white">
						<td width='50%' align='left'>
							Hệ thống cửa hàng bán lẻ hoa quả sạch OhStars.net<br/>
							ĐT: 08.230.230.230<br/>
							Địa chỉ: 130, Tô Ký, Tân Chánh Hiệp, Tp HCM.<br/>
						</td>
						<td align='right' valign="bottom">
							Copyright © 2012 OhStars.net. All right reserved.
						</td>
					</tr>
					</table>
				</div>
				<!--------- end of footer --------->
				
			</td>
			<td width="13%"></td>
		  </tr>
		</table>
		
	</div>
		
		<!-- Modal ------------------------------------------------------------------------------------------------------------------->
		<div class="modal" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display:none">
		<div class="modal-header">
			<table width='100%'>
			<tr>
				<td>
					<h3 id="myModalLabel">Liên hệ</h3>
				</td>
				<td align='right'>
					<b>ĐT</b>: 08.230.230.230
				</td>
			</tr>
			</table>
			
		</div>
		<div class="modal-body">
			<div id ='send_email_success' class="alert alert-success" style='display:none'>
				Ðã gửi email thành công.<br/>
				Chúng tôi sẽ trở lời bạn nhanh nhất có thể! <br/>
				Xin cảm ơn!
			</div>
			<table width='100%' id="contact_form">
				<tr valign='middel'>
					<td width="32%">Họ tên</td>
					<td>
						<input id='email_name' type="text" placeholder="vd: Nguyễn Văn A" class="email">
					</td>
				</tr>
				<tr valign='middel'>
					<td >Email</td>
					<td>
						<input id="email_address" type="text" placeholder="vd: ohstars@gmail.com" class="email">
						<span class="label label-important" id='invalid_email_address' style='display:none'></span>
					</td>
				</tr>
				<tr valign='middel'>
					<td >Địa chỉ</td>
					<td>
						<input id="email_address_1" type="text" placeholder="vd: 32 A, Q11, Tp HCM" class="email">
					</td>
				</tr>
				<tr>
					<td >Thông tin hỗ trợ</td>
					<td>
						<textarea id="email_content" rows="6" style="width:400px" class="email"></textarea>
					</td>
				</tr>
			</table>
		</div>
		<div class="modal-footer">
			<table width='100%'>
			<tr>
				<td align='left'>
					<b>Địa chỉ:</b> 130, Tô Ký, Tân Chánh Hiệp, Q12, Tp HCM
				</td>
				<td align='right'>
					<a href="#" class="btn" onClick="hide_contact_form();">Đóng</a>
					<button id = "send_button" class="btn" onClick="send_email();">Gửi</button>
				</td>
			</tr>
			</table>
		</div>
		</div>
		
		<!-- Support online -->
		<div id = 'chat_tag' class="float_tag"  onclick="javascript:chatWith('ohstars')">
		</div>
		<!-- Support online -->
		<div id = 'email_tag' class="float_tag"  onclick="show_contact_form();return false;">
		</div>
		
		<!-- global script -->
		<script>
			$(document).ready(function(){
                $(window).scroll(function () {
                    set = $(document).scrollTop();
                    $('#chat_tag').animate({top:set+ 200+'px'},{duration:1000,queue:false});
					$('#email_tag').animate({top:set+285+'px'},{duration:1000,queue:false});
                });
            });
			var modal = $('#myModal');
			var height = modal.height();
			var width  = modal.width();
			var contact_form_main_content = modal.innerHTML;
			
			var main_content_body  = $("#main_content_body").html();
		</script>
		
</body>
</html>
